calendar: Fix grid lines in RTL locales

The calendar grid is build by giving each element right and bottom
borders, all top-most elements a top border, and all left-most
elements a left border. However in RTL locales, we currently add
the left border to the *right-most* elements, resulting in the grid
appearing clipped on the left side.

https://bugzilla.gnome.org/show_bug.cgi?id=679879

diff --git a/js/ui/calendar.js b/js/ui/calendar.js
index c29828b887d3f22e23fd2d0afb079e2fa9fbd188..fc01ca534abbe9c82c251d7d9e14fddc36fab8fe 100644 (file)
--- a/js/ui/calendar.js
+++ b/js/ui/calendar.js
@@ -551,6 +551,7 @@ const Calendar = new Lang.Class({
         let row = 2;
         while (true) {
             let button = new St.Button({ label: iter.getDate().toString() });
+            let rtl = button.get_text_direction() == Clutter.TextDirection.RTL;
 
             if (!this._eventSource)
                 button.reactive = false;
@@ -571,7 +572,10 @@ const Calendar = new Lang.Class({
             // Hack used in lieu of border-collapse - see gnome-shell.css
             if (row == 2)
                 styleClass = 'calendar-day-top ' + styleClass;
-            if (iter.getDay() == this._weekStart)
+
+            let leftMost = rtl ? iter.getDay() == (this._weekStart + 6) % 7
+                               : iter.getDay() == this._weekStart;
+            if (leftMost)
                 styleClass = 'calendar-day-left ' + styleClass;
 
             if (_sameDay(now, iter))